import axios from "axios";
import EventBus from "./click"
import { MapListALL } from '../../api/system/device'

let mapInstance = null; // 保存地图实例
const markers = []; // 保存创建的标记点
let bouncingMarker = null; // 当前跳动的标记点
let bounceInterval = null; // 跳动的定时器
let mapsdata = []

// 异步函数，获取地图数据
async function Map() {
  try {
    const res = await MapListALL({ status: '3' });
    initMap(res.data)
    // initMap()
    return res.data; // 返回地图数据
  } catch (error) {
    console.error("Error fetching data:", error); // 输出错误信息到控制台
    return []; // 返回空数组
  }
}

// 创建标记点
function createMarkers(data, map) {
  data.forEach((item) => {
    const src = item.statusLable == "离线" ? require('@/assets/png/hong.png') : require('@/assets/png/lv.png');
    const marker = new TMap.MultiMarker({
      map,
      styles: {
        default: new TMap.MarkerStyle({
          'width': 50,
          'height': 50,
          'anchor': { x: 10, y: 30 },
          'src': item.statusLable == "离线" ? require('@/assets/png/hong.png') : require('@/assets/png/lv.png')
        }),
      },
      geometries: [
        {
          position: new TMap.LatLng(item.latitude, item.longitude),
          id: item.deviceId.toString(),
        },
      ],
    });

    marker.on("click", () => {
      EventBus.$emit('marker', item);
      // toggleBounce(marker); // 调用跳动函数
    });
    markers.push(marker);

  });
}

// 跳动函数
// function toggleBounce(marker) {
//   // 停止当前跳动的标记点
//   if (bouncingMarker && bouncingMarker !== marker) {
//     stopBouncing(bouncingMarker);
//   }

//   // 如果点击的是同一个标记点，则停止跳动
//   if (bouncingMarker === marker) {
//     stopBouncing(marker);
//     return;
//   }

// 开始新的跳动
//   let originalY = marker.getStyles().default.anchor.y;
//   bounceInterval = setInterval(() => {
//     let currentY = marker.getStyles().default.anchor.y;
//     let newY = currentY === originalY ? originalY - 10 : originalY;
//     marker.setStyles({
//       default: { ...marker.getStyles().default, 'anchor': { x: 10, y: newY } }
//     });
//   }, 300); // 每300毫秒切换一次状态

//   bouncingMarker = marker; // 更新当前跳动的标记点
// }

// 停止跳动
// function stopBouncing(marker) {
//   clearInterval(bounceInterval);
//   let originalY = marker.getStyles().default.anchor.y;
//   marker.setStyles({
//     default: { ...marker.getStyles().default, 'anchor': { x: 10, y: originalY } }
//   });
//   bouncingMarker = null;
// }

// 初始化地图
async function initMap(data) {
  const center = new TMap.LatLng(39.5203094, 118.6836092); // 定义地图中心点坐标
  mapInstance = new TMap.Map(document.getElementById("container"), {
    center,
    zoom: 13, // 设置地图缩放级别
    pitch: 0, // 设置俯仰角
    rotation: 0, // 设置地图旋转角度
  });
  createMarkers(data, mapInstance);
}
// 根据id查找标记点
function findMarkerById(id) {
  return markers.find(marker => marker.geometries[0].id === id);
}
// 移动地图到指定的标记点
function moveMapToMarker(marker) {
  if (marker) {
    const bounds = new TMap.LatLngBounds();
    bounds.extend(marker.geometries[0].position);
    mapInstance.setZoom(5);
    mapInstance.fitBounds(bounds);

  }
}
export { Map, initMap, findMarkerById, moveMapToMarker };
